<template>
  <div class="parent">
    <Headers :title="title" />
    <div class="content">
      <div class="status">
        <ul class="list">
          <li class="listItem">
            <div class="left">
              <img src="../../assets/img/logo.jpg" alt="" class="img">
            </div>
            <div class="middle">
              <span class="textTitle">运行</span>
              <span class="text">采集时间: 2019-01-04 08:08</span>
            </div>
            <div class="right">
              <span class="spText">清洗设备</span>
            </div>
          </li>
          <li class="Individual">
            <span class="title">设备厂家</span>
            <span class="name">山东奥神</span>
          </li>
          <li class="Individual">
            <span class="title">设备类型</span>
            <span class="name">低环境温度空气源热泵（冷水）机组</span>
          </li>
          <li class="Individual">
            <span class="title">设备型号</span>
            <span class="name">SLNA-009U</span>
          </li>
          <li class="Individual">
            <span class="title">设备序列号</span>
            <span class="name">712983798127</span>
          </li>
          <li class="Individual">
            <span class="title">传输序列号</span>
            <span class="name">9273981273127398</span>
          </li>
          <li class="Individual">
            <span class="title">安装地址</span>
            <span class="name">北京市海淀区交大东路12号</span>
          </li>
        </ul>
      </div>
    </div>
  </div>
</template>
<script>
import Headers from '@/components/header-return'
export default {
  name: 'myBusinessDetail',
  data () {
    return {
      title: '设备详情'
    }
  },
  components: {
    Headers
  }
}
</script>
<style scoped lang="scss">
.parent{
  width: 100%;
  height: 100%;
  background: #f9f9f9;
}
.listItem{
  width: 100%;
  height: 78px;
  background: #fff;
  padding: 5px;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
  .left{
    width: 62px;
    height: 49px;
    .img{
      width: 100%;
      height: 100%;
    }
  }
  .middle{
    width: 60%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    .textTitle{
      font-size:16px;
      font-family:PingFangSC-Regular;
      font-weight:400;
      color:rgba(51,51,51,1);
    }
    .text{
      font-size:10px;
      font-family:PingFangSC-Regular;
      font-weight:400;
      color:rgba(112,118,129,1);
    }
  }
  .right{
    width: 71px;
    height: 100%;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    .spText{
      font-size:14px;
      font-family:PingFangSC-Regular;
      font-weight:400;
      color:rgba(59,139,251,1);
    }
  }
}
.Individual{
  width: 100%;
  height: 60px;
  background: #fff;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  padding: 0 13px;
  margin-bottom: 10px;
  .title{
    font-size:14px;
    font-family:PingFangSC-Regular;
    font-weight:400;
    color:rgba(51,51,51,1);
  }
  .name{
    font-size:12px;
    font-family:PingFangSC-Regular;
    font-weight:400;
    color:rgba(102,102,102,1);
  }
}
</style>
